<!DOCTYPE html>
<html>
<head>
  <title>Form Interactions</title>
  <link rel="stylesheet" href="styles.css" />
</head>
<body>
  <form>
    <fieldset>
      <label for="range-input">Range Input</label>
      <input name="range-input" type="range" value="0" />
      <p>0</p>
    </fieldset>
  </form>

  <script src="/node_modules/jquery/dist/jquery.js"></script>
  <script>
    $('input[type=range]').on('change', (e) => {
      const $range = $(e.target)
      $range.next('p').text($range.val())
    })
  </script>
</body>
</html>
